Applying type 字型應用
層次透過字型的粗細、大小和間距來表達。字型樣式分為五個角色：Display（展示）、Headline（標題）、Title（小標題）、Body（正文）和Label（標籤），這種裝置無關的分類便於在各種場景中使用。
Roles 角色
1 Display 展示
展示樣式有大、中、小三種尺寸，適用於螢幕上的重要文字和數字，尤其在大螢幕上效果顯著。可選用手寫或書法等富有表現力的字型作為展示字型。
使用展示樣式的卡片，表現力強的字型可以用於展示樣式，以吸引讀者
2 Headline 標題
標題適用於小螢幕上的簡短、重要文字，用於突出主要內容。標題可使用富有表現力的字型，但需確保適當的行高和字距以維持可讀性。
標題樣式比標題字號更小，用於中等強調的簡短文字，適合劃分次要段落或內容區域。在標題中使用富有表現力的字型（如展示字型、手寫字型和花體字）時需謹慎。
4 Body 正文
正文樣式適用於長段落文字。Roboto Flex 具有光學尺寸調整功能，能針對小字號和長文字最佳化可讀性，提供更多樣式選擇。正文應避免使用裝飾性或富有表現力的字型，因為這類字型在小字號下往往難以閱讀。
5 Label 標籤
標籤樣式用於簡短的非互動式文字，如表單欄位、按鈕或圖示中的輔助資訊。它們應保持簡潔，以確保可讀性和功能性。
Typesetting 排版
垂直排版透過填充、邊界框和基線來確保文字可讀性。
1 Using padding and bounding boxes 使用填充和邊界框
行高與邊界框高度保持一致以確保佈局統一。文字在邊界框中垂直居中，遵循CSS標準做法。系統自動計算文字位置，設計師透過邊界框尺寸和字型引數來控制，從而確保跨平臺一致性。
填充是UI元素間的空白，如圖片與邊框之間或邊框內側與文字之間的距離。
使用內邊距和邊界框實現垂直對齊。透過行高、居中對齊和間距的合理設定來確保文字在邊界框內的佈局平衡和統一。
2 Using the baseline 使用基線
基線是文字排列所依據的不可見參考線。在材料設計（Material Design）中，基線作為測量文字與其他元素之間垂直距離的重要標準。
基線還可以作為設計師之間溝通文字位置的通用標準，不受平臺或設計工具的限制。
使用基線進行垂直對齊
基線是排版對齊的基準點，透過它來確定行高、文字位置和元素間距，以實現統一和協調的佈局效果。
Ensuring readability 確保可讀性
行高（Line height）
行高是指文字行之間的間距，它與字型大小直接相關。Material Design 的排版系統針對不同用途最佳化了行高。
表格數字（Tabular numbers）
建議在表格或資料頻繁變化的場景（如時鐘、統計資料）中，使用等寬數字（monospaced numbers），而不是比例數字（proportional numbers），以確保資料列對齊，方便快速瀏覽。
無障礙設計（Accessibility）
1 Color & contrast 顏色與對比度
為支援視覺無障礙設計，需選擇適當的文字與背景對比度。對比度指的是顏色的明暗差異，通常用對比度比率來衡量。關鍵對比度比率可以確保可讀性。符合 WCAG（Web 內容無障礙指南）的標準。
